iT邦幫忙

2023 iThome 鐵人賽

DAY 29
0
Mobile Development

30 天輕鬆學會 Flutter 測試系列 第 29

Day 29 善用工具加速測試

  • 分享至 

  • xImage
  •  

許多人沒有寫測試的習慣,而當問到為什麼不寫測試時,可能大多數的答案都是開發時間不夠,無法寫測試。寫測試的時間過長,有些時候是因為不熟悉如何測試,導致測試時間太長,有些時候則是因為工具不熟練,導致花很多時間在寫固定樣板的程式碼。前者我們只要多思考多寫就能緩解,但是後者可能就需要一點技巧了,今天就來談談如何用 Intellij IDEA 或 Android Studio 的工具加速寫測試速度吧。

由於 Android Studio 也是由 Intellij IDEA 衍生而來,以下我們就直接只說明 Intellij IDEA 如何操作,使用 Android Studio 的朋友也可以用相同的方式操作。

快速建立測試檔案

如果沒有使用工具,當我們想寫測試的時候,我們就得打開長長的目錄,用滑鼠慢慢地移動到目標資料夾,點開右鍵建立新檔案,輸入名稱,整個過程大概也得花上三十秒。或許三十秒看起來不長,但是卻嚴重中斷了我們思考,我們得從原本要寫什麼測試的思考中,跳轉怎麼到建立測試,最後又跳回來想要我測什麼,這當中也會有一些 Context Switch 的成本。

使用 IDE 外掛套件建立套件

使用 Intellij IDEA 的朋友,可以使用 Dart Test 這個外掛套件。當我們想建立測試時,只要 IDE 編輯器中按右鍵,選擇 Dart Test File 就能輸入測試名稱產生測試。

!https://github.com/easylive1989/images/blob/master/static/images/2023IThome/Day29/1.png?raw=true

更快一點,我們也可以在把輸入標停留在類別名稱上,按 Alt + Enter 並選擇 Create Dart test file 也能在相對應的目錄產生測試,減少手動操作的負擔。

!https://github.com/easylive1989/images/blob/master/static/images/2023IThome/Day29/2.png?raw=true

除了 Dart Test 外,還有另外一個 Flutter Test File Creator 也有類似功能,有興趣的讀者也可以嘗試看看。不過呢,這兩個套件都不支援 Intellij IDEA 2023.2 + 以上的版本,而 Android Studio 最新版目前還能使用。

運用 Live Template

當我們產生一個測試檔案後,裡頭肯定還是空空的,那我們馬上需要的就是建立一個 main 方法與 test,而這些程式碼每次都是一模一樣的,每次手動輸入也是令人厭煩的過程。利用 IDE 的 Live Template 用於產生就能快速產生測試程式碼,以下面影片來說,我們只輸入了 mytest 就能產生 main 方法與一個測試方法。

!https://github.com/easylive1989/images/blob/master/static/images/2023IThome/Day29/3.gif?raw=true

那我們要如何設定 Live Template 呢?方法很簡單,從 SettingEditor ⇒ Live Templates 進入編輯。

!https://github.com/easylive1989/images/blob/master/static/images/2023IThome/Day29/4.png?raw=true

接著可以選擇在 Dart 或 Flutter 的群組中按下右側 + 新增一個 Live Templates。

!https://github.com/easylive1989/images/blob/master/static/images/2023IThome/Day29/5.png?raw=true

接著我們依序輸入指令名稱與功能描述,接著在樣板中輸入基本的測試架構,最後選擇語言並按下 OK 之後,我們就直接使用了。指令名稱是什麼呢?當我們在編輯時打出指令名稱,IDE 就會跳出選單讓我們使用指定的名稱來產生對應的樣板程式碼,就如果們我們在開頭影片示範的一樣,輸入 mytest 這個指令名稱,就能產生測試程式碼。

在樣板中我們可以設定一些變數或關鍵字,讓樣板更方便使用,例如上面圖片的 $END$ 就是當樣板產生之後,我們游標會停在 $END$ 的地方。例子中 $TEST_NAME$ 則是變數,變數可以讓我們在樣板產生時自己修改內容,也可以讓樣板幫我們產生一些預設值。

!https://github.com/easylive1989/images/blob/master/static/images/2023IThome/Day29/6.png?raw=true

處了建立測試架構的樣板之外,我們也可以用樣板幫我們產生其他各式各樣常用的程式碼,例如產生新增一個測試、產生 Mock 類別 …等,這邊就不繼續示範,有興趣的朋友可以自己試試。

快速執行 build_runner

在開發 Flutter 程式時,我們會大量使用 build_runner 來產生一些工具程式碼,例如產生 DTO 類別的 Json 解析的方法,或者產生 mockito 的測試替身 …等等,都需要使用 build_runner。

flutter pub run build_runner build

如果每次要產生時,都要使用打開終端機一個字一個字書入未免有些浪費時間,甚至如果不記得指令話,還要花時間打開網頁搜尋指令,而這種工作就很適合使用外掛或 IDE 的功能來處理了。

Flutter-Toolkit 外掛

在 Intellij IDEA 中,我們可以使用 Flutter-Toolkit 這個外掛,他會在 IDE 右上角多幾個功能按鈕,其中就包含 build_runner 執行的動作,也可以在編輯時右鍵來選擇使用。

!https://github.com/easylive1989/images/blob/master/static/images/2023IThome/Day29/7.png?raw=true

但是比較可惜的是,這個套件對於新版的 Intellij IDEA 一樣缺乏支援。

使用 External Tools

除了套件之外,我們也能用 External Tool 來設定一個可以執行 build_runner 的功能。首先我們一樣從 Setting ⇒ Tools ⇒ External Tools 打開設定畫面。

!https://github.com/easylive1989/images/blob/master/static/images/2023IThome/Day29/8.png?raw=true

接著按下 + 新增一個 External Tools,並設定成使用 build_runner,最後按下 ok 儲存。

!https://github.com/easylive1989/images/blob/master/static/images/2023IThome/Day29/9.png?raw=true

最後我們就能在 IDE 上方菜單中的 Tools 找到剛剛設定的工具並執行,就不用每次都手動打指令了。

!https://github.com/easylive1989/images/blob/master/static/images/2023IThome/Day29/10.png?raw=true

同樣的 External Tools 除了拿來執行 build_runner,也能拿來執行很多其他動作,例如使用新版 Intellij IDEA 而無法使用 Dart Test 的朋友,就能用 External Tools 來產生測試檔案。

就算寫快一點,但是效果也有限?

在真正熟練工具或快捷鍵之前,可能很多人會想的是,我就算打字打得快,快捷鍵或工具用的熟練,也省不了多少時間,我還是得花大把時間思考邏輯,感覺上也省不了多少時間。但事實可能並非如此,我們之所以思考的慢,有一部份是因為思考常常被中斷,被什麼東西中斷呢?正是被打字與移動滑鼠的操作中斷。

寫程式時,雖然我們開始前先想好大概要怎麼做,但開始寫的時候,還是一段一段完成的。我們會想一下這段要怎麼寫,寫一段程式碼,可能還要查找其他類別,最後終於完成程式碼,接下來繼續思考下一段要怎麼寫。在上一段思考與下一段思考之間的間隔時間越長,我們就要花越多時間回想再來要做什麼,導致整體思考時間更長。

熟練 IDE 快捷鍵與工具,能顯著的減少寫程式碼的時間,最小化思考與思考之間的中斷時間,讓思考可以更連貫順暢,無形中也縮短了思考的時間。

小結

熟練 IDE 快捷鍵或工具看起來好像很困難,好像要花很多腦力去背誦,但其實只要日復一日的持續使用就會形成肌肉記憶,自然而然的就能提升開發速度,降低開發成本。以測試來說,我們可以減少寫測試的時間,讓開發者更專注在設計測試案例上。


上一篇
Day 28 設計與測試同樣重要
下一篇
Day 30 第三十天之後
系列文
30 天輕鬆學會 Flutter 測試30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言